/**
 * These styles only apply to the borrowTable on pages where
 * the id `admin` or `user` is present on the body element.
 * They should be reviewed and cleaned up as necessary.
 */
@import (less) "less/font-families.less";

/* stylelint-disable selector-max-specificity */
.borrow-table {
  margin: 30px 0 25px;
  table {
    width: 100%;
    font-family: @lucida_sans_serif-7;
    th {
      border-bottom: 1px solid @beige-three;
      vertical-align: bottom;
      padding-bottom: 10px;
      font-family: @lucida_sans_serif-1;
      color: @brown;
      font-weight: 600;
      font-size: .6875em;
      text-transform: uppercase;
      white-space: nowrap;
      text-align: center;
      &.titles {
        text-align: left;
      }
      &.xtitles {
        text-align: left !important;
      }
    }
  }

  tr {
    &.row-available {
      background: @admin-row-background !important;
      .status-value {
        color: @dark-green;
      }
    }
  }

  td.status, th.status {
    padding: 15px;
    text-align: center;
  }

  td.serial {
    padding: 15px 0;
    text-align: right;
    width: 20px;
  }

  .current-loan tbody tr {
    background: @soft-green !important;
  }

  .checkedout-elsewhere {
    padding: 15px;
    background: @orange-four !important;
    border: 1px solid @orange-five;
  }

  .available {
    padding: 15px;
    background: @soft-green !important;
    border: 1px solid @soft-green-two;
  }

  .section {
    margin: 25px 0;
  }

  .section h3 {
    margin: 1em 0 .5em;
  }

  div#alert0 {
    background-color: @admin-row-background !important;
    border: 1px solid @orange-five;
  }
  ul.inner {
    margin-bottom: 0 !important;
  }
}
